const pageSchema = {
  baseView: {
    desc: '基底容器',
    el: 'div',
    rect: {
      width: '80%',
      height: '80%',
      left: 0,
      top: 0
    },
    style: { // 渲染样式
      'background-color': '#9ed0ff'
    },
    material: [
      {
        name: '背景色',
        attr: 'background-color',
        widget: 'color',
        value: ''
      }
    ], // 可操控属性
    nodeName: 'baseView'
  },
  bg: {
    desc: '背景图',
    el: 'img',
    rect: {
      width: '50%',
      height: '300px',
      left: 0,
      top: 0
    },
    style: {
      'background-color': '#f0f8ff'
    },
    material: [
      {
        name: '背景色',
        attr: 'background-color',
        widget: 'color',
        value: ''
      },
      {
        name: '圆角',
        attr: 'border-radius',
        widget: 'border-radius',
        value: ''
      },
      {
        name: '图片地址',
        attr: 'url',
        widget: 'text',
        value: ''
      }
    ], // 可操控属性
    src: '',
    nodeName: 'bg'
  },
  view: {
    desc: '容器',
    el: 'div',
    rect: {
      width: '80%',
      height: '50%',
      left: 0,
      top: 0
    },
    style: {
      'background-color': '#ffe4c4'
    },
    material: [
      {
        name: '背景色',
        attr: 'background-color',
        widget: 'color',
        value: ''
      },
      {
        name: '圆角',
        attr: 'border-radius',
        widget: 'border-radius',
        value: ''
      },
      {
        name: '阴影',
        attr: 'box-shadow',
        widget: 'box-shadow',
        value: ''
      },
      {
        name: '边框',
        attr: 'border',
        widget: 'border',
        value: ''
      }
    ], // 可操控属性
    nodeName: 'view'
  },
  button: {
    desc: '按钮',
    el: 'div',
    rect: {
      width: '100px',
      height: '40px',
      left: '50%',
      top: '50%',
    },
    style: {
      'background-color': '#62adee',
      color: '#ffffff',
      'text-align': 'center',
      'line-height': '40px'
    },
    material: [
      {
        name: '背景色',
        attr: 'background-color',
        widget: 'color',
        value: ''
      },
      {
        name: '字体颜色',
        attr: 'color',
        widget: 'color',
        value: ''
      },
      {
        name: '文本居中',
        attr: 'text-align',
        widget: 'text-align',
        value: ''
      },
      {
        name: '行高',
        attr: 'line-height',
        widget: 'number',
        value: ''
      },
      {
        name: '圆角',
        attr: 'border-radius',
        widget: 'border-radius',
        value: ''
      },
      {
        name: '阴影',
        attr: 'box-shadow',
        widget: 'box-shadow',
        value: ''
      },
      {
        name: '边框',
        attr: 'border',
        widget: 'border',
        value: ''
      }
    ], // 可操控属性
    nodeName: 'button',
    content: '按钮'
  },
  text: {
    desc: '文字',
    el: 'div',
    rect: {
      width: 50,
      height: 50,
      left: 0,
      top: 0
    },
    style: {
      border: '1px dotted rgb(238 98 98)',
      'font-size': '14px',
      color: '#ef6b6b'
    },
    material: [
      {
        name: '字体颜色',
        attr: 'color',
        widget: 'color',
        value: ''
      },
      {
        name: '字体大小',
        attr: 'font-size',
        widget: 'number',
        value: ''
      },
      {
        name: '字体粗细',
        attr: 'font-weight',
        widget: 'text',
        value: ''
      },
      {
        name: '文本阴影',
        attr: 'text-shadow',
        widget: 'text-shadow',
        value: ''
      }
    ], // 可操控属性
    nodeName: 'text',
    content: '文字'
  }
}